<template>
  <jl-base>
    <jl-header>
      <mt-header title="我的" :fixed="true"/>
    </jl-header>

    <jl-content>
      <div class="w12 mb0 mt15 bgcolor_white">
        <div class="w03 ">
          <img class="w12 mb10 ml10 mt10" style="height: 87px;" src="../../../../static/imgs/userPic.png"/>
        </div>
        <div class="w08 mt20 ml20" style="height: 87px;">
          <h2>{{userInfo.PCRM_CZY03}}</h2>
          <p>{{userInfo.PCRM_BM02}}</p>
        </div>
      </div>

      <div class="dld_body mt10">
        <div class="jl_form" @click="surplusList">
          <div class="jl_form_item">
            <span class="w04">可用余额</span>
            <span class="w08 tr font_gray">{{surplus|money}}</span>
            <i class="fa fa-angle-right"></i>
          </div>
        </div>
      </div>

      <div class="dld_body mt10">
        <div class="jl_form" @click="changePassword">
          <div class="jl_form_item">
            <span class="w04">修改密码</span>
            <span class="w08 tr font_gray"></span>
            <i class="fa fa-angle-right"></i>
          </div>
        </div>
      </div>

      <div class="dld_body mt10">
        <jl-search-my-data label="工程登录单" title="登录单"
                           sqlid="app.engineer.searchMyStart"
                           type="start"
                           resultName="list"
                           goName="my-start-detailed"
                           placeholder="搜索登录单号,使用单位,使用单位地址,联系电话可模糊搜索"
                           :isSearchShow="true">
          <div class="qd_item">
            <div class="qd_header bor_bottom">
              <div class="w12 qd_address">
                <em class="mr5">{GC_DJZT}</em>{GCLX} - {SYDW}
              </div>
              <div class="w12 mt10">
                <span class="w12"><i class="fa fa-map-marker mr5"></i>{SYDWDZ}</span>
                <span class="w06 mt10 tl"><i class="fa fa-file-text mr5"></i>{GCDLD01}</span>
                <span class="w06 mt10 tr"><i class="fa fa-clock-o mr5"></i>{SBSJ}</span>
                <span class="w06 mt10 tl"><i class="fa fa-user-circle-o mr5"></i>{LXR}</span>
                <span class="w06 mt10 tr"><i class="fa fa-phone mr5"></i>{LXDH}</span>
              </div>
            </div>
          </div>
        </jl-search-my-data>
        <jl-search-my-data label="工程合同" title="合同"
                           sqlid="app.engineer.searchMyContract"
                           resultName="list"
                           type="contract"
                           goName="my-contract-detaild">
          <div class="qd_item">
            <div class="qd_header bor_bottom">
              <div class="w12 qd_address">
                <em class="mr5">{DJZT}</em>{GCLX} - {SYDW}
              </div>
              <div class="w12 mt10">
                <span class="w12"><i class="fa fa-map-marker mr5"></i>{SYDWDZ}</span>
                <span class="w06 mt10 tl"><i class="fa fa-file-text mr5"></i>{GCDLD01}</span>
                <span class="w06 mt10 tr"><i class="fa fa-clock-o mr5"></i>{ZDSJ}</span>
                <span class="w06 mt10 tl"><i class="fa fa-user-circle-o mr5"></i>{LXR}</span>
                <span class="w06 mt10 tr"><i class="fa fa-phone mr5"></i>{LXDH}</span>
              </div>
            </div>
          </div>
        </jl-search-my-data>
        <jl-search-my-data label="工程要货单" title="要货单"
                           resultName="list"
                           sqlid="app.engineer.searchMyNeed"
                           type="need"
                           goName="my-need-detailed">
          <div class="qd_item">
            <div class="qd_header bor_bottom">
              <div class="w12 qd_address">
                <em class="mr5">{DJZT}</em>{GCLX} - {SYDW}
              </div>
              <div class="w12 mt10">
                <span class="w12"><i class="fa fa-map-marker mr5"></i>{SYDWDZ}</span>
                <span class="w06 mt10 tl"><i class="fa fa-file-text mr5"></i>{GCDLD01}</span>
                <span class="w06 mt10 tr"><i class="fa fa-clock-o mr5"></i>{ZDSJ}</span>
                <span class="w06 mt10 tl"><i class="fa fa-user-circle-o mr5"></i>{LXR}</span>
                <span class="w06 mt10 tr"><i class="fa fa-phone mr5"></i>{LXDH}</span>
              </div>
            </div>
          </div>
        </jl-search-my-data>
        <jl-search-my-data label="工程交资料"
                           sqlid="app.engineer.searchMyInformation"
                           type="data"
                           result-name="list"
                           title="交资料"
                           goName="my-data-detailed">
          <div class="qd_item">
            <div class="qd_header bor_bottom">
              <div class="w12 qd_address">
                <em class="mr5">{DJZT}</em>{GCLX} - {SYDW}
              </div>
              <div class="w12 mt10">
                <span class="w12"><i class="fa fa-map-marker mr5"></i>{SYDWDZ}</span>
                <span class="w06 mt10 tl"><i class="fa fa-file-text mr5"></i>{GCDLD01}</span>
                <span class="w06 mt10 tr"><i class="fa fa-clock-o mr5"></i>{ZDSJ}</span>
                <span class="w06 mt10 tl"><i class="fa fa-user-circle-o mr5"></i>{LXR}</span>
                <span class="w06 mt10 tr"><i class="fa fa-phone mr5"></i>{LXDH}</span>
              </div>
            </div>
          </div>
        </jl-search-my-data>
      </div>

      <div class="dld_body mt10">
        <div class="jl_form" v-on:click="logout">
          <div class="jl_form_item pr15">
            <span class="w12 tc font_black_999"><i class="fa fa-sign-out mr5"></i>退出登录</span>
          </div>
        </div>
      </div>

    </jl-content>

  </jl-base>
</template>

<script>
  export default {
    data() {
      return {
        surplus: 0,
        userInfo: {},
        popupVisible: true,
        address: [],
        addressJson: {},
        date: ''
      }
    },
    methods: {
      logout() {
        localStorage.removeItem("userInfo");
        localStorage.removeItem("SessionId");
        this.$router.push({name: "login"});
      },
      changePassword() {
        this.$router.push('/agent/my/password');
      },
      surplusList() {
        this.$router.push('/agent/my/surplus');
      }
    },
    created() {
      this.userInfo = $Utils.getUserInfo();
      this.$engineer.searchMydata()
        .then(v => {
          this.surplus = v['surplus'] | 0;
        })
    }
  }
</script>

<style scoped>
</style>
